<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>图书管理推荐系统</title>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
	<link rel="stylesheet" th:href="@{/static/component/bootstrap/css/bootstrap.min.css}"></link>
	<link rel="stylesheet" th:href="@{/static/component/font-awesome/css/font-awesome.min.css}"></link>
	<link rel="stylesheet" th:href="@{/static/component/font-awesome/index.css}"></link>
	<link rel="stylesheet" th:href="@{/static/component/font-awesome/skins/_all-skins.css}"></link>
	<link rel="stylesheet" th:href="@{/static/component/layer/theme/default/layer.css}"></link>
</head>
<body class="hold-transition skin-blue sidebar-mini" style="overflow:hidden;">
<div id="mainDiv">
	<div id="ajax-loader" style="cursor: progress; position: fixed; top: -50%; left: -50%; width: 200%; height: 200%; background: #fff; z-index: 10000; overflow: hidden;">
		<img th:src="@{/static/images/adminEdition/index/ajax-loader.gif}" style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;" />
	</div>
    <div class="wrapper">
        <!--头部信息-->
        <header class="main-header">
            <nav class="navbar navbar-static-top">
            	 <a class="sidebar-toggle">
	                <span class="sr-only">Toggle</span>
	            </a>
                <a href="javascript:;" class="logo1">
	                <span class="logo-lg" >图书管理推荐系统（管理端）</span>
	            </a>
                <div class="navbar-custom-menu" style="margin-right: 20px;">
                    <ul class="nav navbar-nav">
                        <li class="dropdown tasks-menu" title="关于软件" onclick="aboutSoftware()">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="ace-icon fa fa-desktop"></i>
                            </a>
                        </li>
                        <li class="dropdown tasks-menu" title="退出系统" onclick="logout()">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                <i class="ace-icon fa fa-power-off"></i>
                            </a>
                        </li>
                    </ul>
                </div>
            </nav>
        </header>
        <!--左边导航-->
        <div class="main-sidebar">
            <div class="sidebar">
                <div class="user-panel">
                    <div class="pull-left image">
                        <img title="张三" th:src="@{/static/images/defaultUser.svg}" style="float: right; margin-right: 8px; height: 40px; width: 40px;"/>
                    </div>
                    <div class="pull-left info">
                    	<p th:text="${username}"></p>
                        <a><i class="fa fa-circle text-success">&nbsp;{{new Date().Format('yyyy-MM-dd')}}</i></a>
                    </div>
                </div>
                 <ul class="sidebar-menu" id="sidebar-menu">
                    <template v-for="(data, index) in menus">
			        	<li class="treeview" :class="[index == 0 ? 'active' : '']">
			            <a class="menuItem" v-bind:href="data.href" v-bind:data-id="data.id">
			              <i class="fa fa-desktop"></i>
			              <span>{{data.name}}</span>
			              <i class="fa fa-angle-left pull-right" v-if="(data.childrens != null) && (data.childrens.length > 0)"></i>
			            </a>
			            <!-- 二级菜单 Start -->
			             <ul class="treeview-menu" v-if="data.childrens != null && data.childrens.length > 0">
				              <li v-for="child in data.childrens" style="cursor: pointer;">
				                <a v-bind:href="child.href" class="menuItem" v-bind:data-id="child.id">
				                <i class="fa fa-list"></i>
				                <span>{{child.name}}</span>
					            <i class="fa fa-angle-left pull-right" v-if="(child.childrens != null) && (child.childrens.length > 0)"></i>
				                </a>
				                <!-- 三级菜单 Start -->
								<ul class="treeview-menu" v-if="child.childrens != null && child.childrens.length > 0">
									<li v-for="child2 in child.childrens" style="line-height: 12px; cursor: pointer;">
										<a v-bind:href="child2.href" class="menuItem" v-bind:data-id="child2.id">
										<i class="fa fa-list-alt"></i>
										<span>{{child2.name}}</span>
										<i class="fa fa-angle-left pull-right" v-if="child2.childrens != null && child2.childrens.length > 0"></i>
										</a>
									</li>
								</ul>
					          </li>
			             </ul>
			            </li>
			        </template>
                </ul>
            </div>
        </div>
        <!--中间内容-->
        <div id="content-wrapper" class="content-wrapper">
            <div class="content-tabs">
                <button class="roll-nav roll-left tabLeft">
                    <i class="fa fa-backward"></i>
                </button>
                <nav class="page-tabs menuTabs">
                    <div class="page-tabs-content" style="margin-left: 0px;">
                    </div>
                </nav>
                <button class="roll-nav roll-right tabRight">
                    <i class="fa fa-forward" style="margin-left: 3px;"></i>
                </button>
                <div class="btn-group roll-nav roll-right">
                    <button class="dropdown tabClose" data-toggle="dropdown">
						任务操作<i class="fa fa-caret-down" style="padding-left: 3px;"></i>
                    </button>
                    <ul class="dropdown-menu dropdown-menu-right">
                        <li><a class="tabReload" href="javascript:void();">刷新当前</a></li>
                        <li><a class="tabCloseCurrent" href="javascript:void();">关闭当前</a></li>
                        <li><a class="tabCloseAll" href="javascript:void();">全部关闭</a></li>
                        <li><a class="tabCloseOther" href="javascript:void();">除此之外全部关闭</a></li>
                    </ul>
                </div>
                <button class="roll-nav roll-right fullscreen"><i class="fa fa-arrows-alt"></i></button>
            </div>
            <div class="content-iframe" style="overflow: hidden;">
                <div class="mainContent" id="content-main" style="padding: 0;">
                    <iframe class="LRADMS_iframe" :src="currentSrc" id="contentArea" name="contentArea" width="100%" height="100%" frameborder="0"></iframe>
                </div>
            </div>
        </div>
    </div>
</div>
<span th:include="./commons/common-js.html :: commonOnLoadJs"></span>
</body>
<script th:src="@{/static/component/bootstrap/js/bootstrap.min.js}"></script>
<script type="text/javascript">
const BASE_PATH = [[@{/}]];
const URLS = {
	APIS: {
		
	}
};
var app = new Vue({
	el: '#mainDiv',
	data: {
		currentSrc: BASE_PATH+'/defaultPage',
		menus: [{
			id: 0,
			name: '基础信息',
			href: '',
			childrens: [{
				id: 11,
				name: '用户列表',
				href: BASE_PATH+'/web/user/list'
			},{
				id: 12,
				name: '图书列表',
				href: BASE_PATH+'/web/book/list'
			},{
				id: 13,
				name: '用户图书评价列表',
				href: BASE_PATH+'/web/rating/list'
			},{
				id: 14,
				name: '院系列表',
				href: BASE_PATH+'/web/meta/faculty/list'
			},{
				id: 15,
				name: '专业列表',
				href: BASE_PATH+'/web/meta/major/list'
			},{
				id: 16,
				name: '系统管理员列表',
				href: BASE_PATH+'/web/adminUser/list'
			}]
		},{
			id: 1,
			name: '推荐算法',
			href: '',
			childrens: [{
				id: 21,
				name: '基于用户的协同过滤',
				href: BASE_PATH+'/web/algorithm/cf/userBasedRecommender'
			},{
				id: 22,
				name: '基于图书的协同过滤',
				href: BASE_PATH+'/web/algorithm/cf/itemBasedRecommender'
			},{
				id: 22,
				name: '基于热门图书推荐',
				href: BASE_PATH+'/web/algorithm/cf/popularBookRecommender'
			}]
		},{
			id: 2,
			name: '用户信息',
			href: '',
			childrens: [{
				id: 31,
				name: '用户借阅',
				href: BASE_PATH+'/web/user/borrow/list'
			},{
				id: 32,
				name: '用户收藏',
				href: BASE_PATH+'/web/user/collect/list'
			},{
				id: 33,
				name: '用户评论',
				href: BASE_PATH+'/web/user/comment/list'
			}]
		}]
	},
	methods: {
		init: function() {
			
		}
	},
	mounted: function() {
 		this.init();
 	}
});
</script>
</html>